import React ,{Suspense}from 'react'

import {
  Routes,
  Route,
  Navigate,
  useRoutes,
} from 'react-router-dom'
import {routes} from './router'

const App = () => {
  const routesConfig = useRoutes(routes)

  return (
    <Suspense fallback={<div className='loading'>loading....</div>}>
      {routesConfig}
    </Suspense>
  )
  // return (
  //   <Routes>
  //     <Route path='/' element={<Navigate to='/home'/>}/>
  //     <Route path='/home' element={<Home />}>
  //       <Route path='/home' element={<Navigate to='/home/child1'/>}/>
  //       <Route path='/home/child1' element={<Child1 />}/>
  //       <Route path='/home/child2' element={<Child2 />}/>
  //     </Route>
  //     <Route path='/detail' element={<Detail />}/>
  //     <Route path='/login' element={<Login />}/>
  //     <Route path='*' element={<NotFound />}/>
  //   </Routes>
  // )
}

export default App
